<div class="join-affiliate">
    <div class="{% unless section.settings.full_width %}page-width{% endunless %}">
        {%- if section.settings.heading != blank -%}
         <div class="affiliate-title">
            <div class="title">
               <span> {{ section.settings.heading | escape }}</span>
             </div> 
         </div>
       {%- endif -%}
       <div class="swiper-father">
        <div class="swiper affiliateSwiper list-block">
            <div class="swiper-wrapper">
             {%- for block in section.blocks -%}
                <div class="swiper-slide" {{ block.shopify_attributes }}>
                  <div class="affiliateSwiper-list">
                    {% if block.settings.icon !=blank %}
                       {{ block.settings.icon }}
                    {% endif %}
                    <div class="reasons-list">
                     {%- if block.settings.title != blank -%}
                      <p>{{ block.settings.title }}</p>
                     {%- endif -%}
                   {%- if block.settings.text != blank -%}
                     <div class="rte">
                         {{ block.settings.text }}
                     </div>
                   {%- endif -%}
                    </div>
                  </div>
                </div>
              {%- endfor -%}
            </div>
        </div>
       </div>
    </div>
</div>


  <script>
    var swiper = new Swiper(".list-block", {
      speed: 600,
      slidesPerView:1,
      spaceBetween:0,
      observer:true,
      observeParents:true,
      spaceBetween: 25,
      breakpoints: {
        320: {
          slidesPerView:1,
          spaceBetween: 26,
        },
        375: {
          slidesPerView: 1.2,
          spaceBetween: 26,
        },
        640: {
          slidesPerView:1.2,
          spaceBetween: 20,
        },
        750: {
          slidesPerView: 2.3,
          spaceBetween:20,
        },
        768: {
          slidesPerView: 2.3,
          spaceBetween:20,
        },
        900: {
          slidesPerView: 2.3,
          spaceBetween:20,
        },
         1280: {
          slidesPerView: 3.2,
          spaceBetween:20,
        },
        1440: {
          slidesPerView: 4,
          spaceBetween:20,
        },
      }
    });
  </script>

{% schema %}
{
  "name": "List block",
  "tag": "section",
  "class": "spaced-section spaced-section--full-width",
  "settings": [
  {
    "type": "text",
    "id": "heading",
    "default": "Talk about your brand",
    "label": "Heading"
  },
  {
    "type": "checkbox",
    "id": "full_width",
    "default": false,
    "label": "t:sections.rich-text.settings.full_width.label"
  }
  ],
  "blocks": [
  {
    "type": "column",
    "name": "column",
    "settings": [
    {
      "type": "html",
      "id": "icon",
      "label": "Icon"
    },
     {
        "type": "text",
        "id": "title",
        "label": "Title"
      },
      {
        "type": "richtext",
        "id": "text",
        "label": "Text"
      }
    ]
  }
  ],
  "presets": [
    {
      "name": "List block"
    }
  ]
}
{% endschema %}
